<!DOCTYPE html>
<html data-view-directly-accessible="false">
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	
	<meta name="format-detection" content="telephone = no">
	<meta name="msapplication-tap-highlight" content="no">
	<meta name="progma" content="no-cache">
	<meta name="cache-control" content="no-cache, no-store, must-revalidate">
	<meta name="viewport" content="user-scalable = no, initial-scale = 1, maximum-scale = 1, minimum-scale = 1, width = device-width">

	<link rel="stylesheet" href="css/view.css">
	<link rel="stylesheet" href="css/index.css">

	<title>view-switch-animation</title>
</head>
<body>
	<section data-view-id="page1" data-view="true" data-view-default="true">
		<header>
			<span class="nav-back" data-view-rel=":back"></span>
			视图1
			<a class = "nav-homepage" data-view-rel = "@../../../index.html"></a>
		</header>
		<h1>视图1 的命名空间默认为：'default'，地址栏将只体现视图ID：#page1</h1>
		<div
			data-view-rel="page2"
			data-view-rel-type = "nav"
			data-view-rel-namespace = "my-namespace"
			class="btn">进入视图2</div>
	</section>
	<section data-view-id="page2" data-view-namespace = "my-namespace" data-view="true">
		<header>
			<span class="nav-back" data-view-rel=":back"></span>
			视图2
			<a class = "nav-homepage" data-view-rel = "@../../../index.html"></a>
		</header>
		<h1>视图2 的命名空间声明为：'my-namespace'，地址栏同时体现了视图ID和视图命名空间：#page2@my-namespace</h1>
		<div
			data-view-rel="page1"
			data-view-rel-type = "nav"
			data-view-rel-namespace = "default"
			class="btn">进入视图1</div>
	</section>

	
	<script type = "text/javascript" src = "js/view.min.js"></script>
	<script type = "text/javascript" src = "js/view.switch.js"></script>
</body>
</html>